<template>
  <div class="getticked">
    <el-form
      :model="piaoruleForm"
      :rules="piaorules"
      ref="piaoruleForm"
      label-width="100px"
      class="forms"
      :disabled="edit ? true : false"
    >
      <el-form-item label="公司名称" prop="corporateName">
        <el-input
          placeholder="请输入公司名称"
          v-model="piaoruleForm.corporateName"
        ></el-input>
      </el-form-item>
      <el-form-item label="注册地址" prop="registeredAddress">
        <el-input
          placeholder="请输入注册地址"
          v-model="piaoruleForm.registeredAddress"
        ></el-input>
      </el-form-item>
      <el-form-item label="邮编" >
        <el-input
          placeholder="请输入邮编"
          v-model="piaoruleForm.zipCode"
        ></el-input>
      </el-form-item>

      <el-form-item label="委托代理人" prop="entrustedAgent">
        <el-input
          placeholder="请输入委托代理人"
          v-model="piaoruleForm.entrustedAgent"
        ></el-input>
      </el-form-item>
      <el-form-item label="手机号" prop="invoicingMobile">
        <el-input
          placeholder="请输入手机号"
          v-model="piaoruleForm.invoicingMobile"
        ></el-input>
      </el-form-item>

      <el-form-item label="传真">
        <el-input
          placeholder="请输入传真"
          v-model="piaoruleForm.facsimile"
        ></el-input>
      </el-form-item>

      <el-form-item label="税号" prop="dutyParagraph">
        <el-input
          placeholder="请输入税号"
          v-model="piaoruleForm.dutyParagraph"
        ></el-input>
      </el-form-item>

      <el-form-item label="账号" prop="accountNumber">
        <el-input
          placeholder="请输入账号"
          v-model="piaoruleForm.accountNumber"
        ></el-input>
      </el-form-item>
      <el-form-item label="开户行" prop="bankName">
        <el-input
          placeholder="请输入开户行"
          v-model="piaoruleForm.bankName"
        ></el-input>
      </el-form-item>

      <el-form-item v-if="!edit ? true : false">
        <el-button plain  @click="cancel()"
          >取消</el-button
        >
        <el-button type="primary" @click="AddrForm('piaoruleForm')"
          >保存</el-button
        >
      </el-form-item>
    </el-form>
  </div>
</template>

<script>

import { invoicing } from "../../apis/index";
export default {
  props: ["infBox", "edit"],
  name: "getticked",
  components: {},
  data() {
    return {
      // 开票信息
      piaoruleForm: {
        corporateName: "",
        registeredAddress: "",
        zipCode: "",
        entrustedAgent: "",
        invoicingMobile: "",
        facsimile: "",
        dutyParagraph: "",
        accountNumber: "",
        bankName: "",
      },
      piaorules: {
        corporateName: [
          {
            required: true,
            message: "请输入公司名称",
            trigger: ["blur", "change"],
          },
        ],
        registeredAddress: [{ required: true, message: "请输入注册地址", trigger: "blur" }],
        zipCode: [{ required: true, message: "请输入邮编", trigger: "blur" }],
        entrustedAgent: [
          { required: true, message: "请输入委托代理人", trigger: "blur" },
        ],
        invoicingMobile: [
          {
            required: true,
            pattern: /^[1][0-9]{10}$/,
            message: "请输入有效的手机号",
          },
        ],
        facsimile: [{ required: true, message: "请输入传真", trigger: "blur" }],

        dutyParagraph: [{ required: true, message: "请输入税号", trigger: "blur" }],

        accountNumber: [{ required: true, message: "请输入账号", trigger: "blur" }],

        bankName: [
          { required: true, message: "请输入开户行", trigger: "blur" },
        ],
      },
    };
  },
  watch: {
    // 获取开始时间和结束时间
    infBox: {
      handler(selectDay) {
        console.log(selectDay, 3333333333333);
        this.piaoruleForm = selectDay;
      },
      deep: true, //如果改成监听searchData，然后把这行放开，就可以监听到searchData中任一值
    },
  },
  computed: {},
  created() {},
  methods: {
    cancel(){
      this.$emit('Fngetticked')
    },
    // 开票设置

    AddrForm(ele) {
      this.$refs[ele].validate(async (valid) => {
        if (valid) {

          invoicing(this.piaoruleForm)
            .then((res) => {
              console.log(res,555555);

              this.$message({
                message: res.data.msg,
                type: "success",
              });

              this.$emit('Fngetticked',true)
             })
            .catch(() => {});

        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
::v-deep .el-button.is-plain:focus, .el-button.is-plain:hover{
  border: 1px solid #25a2ab;
  color: #25a2ab;
}
.forms {
  width: 500px;
  margin: 50px 0;
}
.getticked {
}
</style>